import React, { Suspense } from "react";
import { BrowserRouter as Router, Route, Routes } from "react-router-dom";
import routes from "./route";
type Props = {};

const AppRouter = (props: Props) => {
  const renderRoute = (routes: any) => {
    if (!Array.isArray(routes)) {
      return null;
    }
    return routes.map((route: any) => (
      <Route
        key={route.path}
        path={route.path}
        element={<route.component></route.component>}
        index={route.index}
      >
        {renderRoute(route.children)}
      </Route>
    ));
  };

  return (
    <Router>
      <Suspense fallback={null}>
        <Routes>{renderRoute(routes)}</Routes>
      </Suspense>
    </Router>
  );
};
export default AppRouter;
